<template>
	<!-- 儲值機票卷掃碼 -->
	<view class="container">
		<view class="logo">
			<image src="/static/images/orderCade.png" mode=""></image>
		</view>
		<view class="title">儲值機自助驗票</view>
		<view class="inp">
			<input style="flex: 1;" type="text" placeholder="點擊輸入票卷兌換碼" placeholder-style="font-size:26rpx;color:#999">
			<image src="/static/images/iconfontscan.png" class="scan"></image>
		</view>
		<view class="exchange_btn">兌換</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			};
		}
	}
</script>

<style lang="less">
	.container {
		padding: 43rpx;
		box-sizing: border-box;

		.logo {
			width: 187rpx;
			height: 187rpx;
			// background: skyblue;
			margin: 0 auto;
			image{
				width: 187rpx;
				height: 187rpx;
			}
		}

		.title {
			font-size: 36rpx;
			text-align: center;
			margin: 20rpx 0 43rpx;
		}

		.inp {
			margin: 0 49rpx 0 39rpx;
			border-bottom: 1rpx solid #f2f2f2;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding-bottom: 5rpx;
			.scan{
				width: 44rpx;
				height: 44rpx;
			}
		}
		.exchange_btn{
			width: 252rpx;
			height: 69rpx;
			background: #39B19D;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			opacity: 1;
			border: 1rpx solid #39B19D;
			text-align: center;
			line-height: 69rpx;
			color: #fff;
			margin: 69rpx auto;
		}
	}
</style>